﻿@model ProductModel
@using Nop.Core;
@using Nop.Core.Domain.Common;
@using Nop.Core.Infrastructure;
@using Nop.Web;
@using Nop.Web.Framework.UI;
@using Nop.Web.Models.Catalog;
@{
    Layout = "~/Views/Shared/_ColumnsTwo4.cshtml";

    //title, meta
    Html.AddTitleParts(!String.IsNullOrEmpty(Model.MetaTitle) ? Model.MetaTitle : Model.Name);
    Html.AddMetaDescriptionParts(Model.MetaDescription);
    Html.AddMetaKeywordParts(Model.MetaKeywords);

    var canonicalUrlsEnabled = EngineContext.Current.Resolve<SeoSettings>().CanonicalUrlsEnabled;
    if (canonicalUrlsEnabled)
    {
        var productUrl = Url.RouteUrl("Product", new { productId = Model.Id, SeName = Model.SeName }, this.Request.Url.Scheme);
        Html.AddCanonicalUrlParts(productUrl);
    }
}
@{
    var defaultProductVariant = Model.ProductVariantModels.Count > 0 ? Model.ProductVariantModels[0] : null;

    //errors
    var errors = new List<string>();
    foreach (var modelState in ViewData.ModelState.Values)
    {
        foreach (var error in modelState.Errors)
        {
            errors.Add(error.ErrorMessage);
        }
    }
}
@if (errors.Count > 0)
{
    var addToCartWarningsSb = new System.Text.StringBuilder();
    for (int i = 0; i < errors.Count; i++)
    {
        addToCartWarningsSb.Append(errors[i]);
        if (i != errors.Count - 1)
        {
            addToCartWarningsSb.Append("\\n");
        }
    }

    //display errors   
    <script type="text/javascript">
        $(document).ready(function () {
            alert('@Html.Raw(addToCartWarningsSb.ToString())');
            
        });/*ready*/
    </script>
}
<!--product breadcrumb-->
@Html.Action("ProductBreadcrumb", "Catalog", new { productId = Model.Id })
<div class="clear">
</div>
<div class="product-details-page">
    @*we add enctype = "multipart/form-data" because "File upload" attribute control type requries it*@
    @using (Html.BeginRouteForm("Product", new { productId = Model.Id, SeName = Model.SeName }, FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        <div class="product-essential">
            <div class="product-details-info">
                <!--product pictures-->
                @Html.Partial("_ProductDetailsPictures", Model)
                <div class="overview">
                    <h1 class="productname">
                        @Model.Name
                    </h1>
                    <br />
                    @*<div class="shortdescription">
                        @Html.Raw(Model.ShortDescription)
                    </div>*@
                    <div class="clear">
                    </div>
                    <!--product SKU, manufacturer part number, stock info-->
                    @Html.Partial("_ProductVariant_SKU_Man_Stock", defaultProductVariant)
                    <div class="clear">
                    </div>
                    <!--Back in stock subscription-->
                    @*@Html.Partial("_ProductVariantBackInStockSubscription", defaultProductVariant)
                    <div class="clear">
                    </div>*@
                    <!--product manufactures-->
                    @*@Html.Action("ProductManufacturers", "Catalog", new { productId = Model.Id })
                    <div class="clear">
                    </div>*@
                    <!--product reviews-->
                    @*@Html.Action("ProductReviewOverview", "Catalog", new { productId = Model.Id })
                    <div class="clear">
                    </div>*@
                    <!--sample download-->
                    @*@Html.Partial("_DownloadSample", defaultProductVariant)
                    <div class="clear">
                    </div>*@
                    
                    @Html.Action("ShareButton", "Catalog")
                    <div class="clear">
                    </div>
                    <div class="one-variant-price">
                        @{
                   var dataDictPrice = new ViewDataDictionary();
                   dataDictPrice.TemplateInfo.HtmlFieldPrefix = string.Format("price_{0}", defaultProductVariant.Id);
                            @Html.Partial("_ProductVariantPrice", defaultProductVariant.ProductVariantPrice, dataDictPrice)
                            <br />
                            <div style="line-height: 180%">
                            </div>
                            <br />
                       var dataDictAttributes = new ViewDataDictionary();
                       dataDictAttributes.TemplateInfo.HtmlFieldPrefix = string.Format("attributes_{0}", defaultProductVariant.Id);
                            @Html.Partial("_ProductAttributes", defaultProductVariant.ProductVariantAttributes, dataDictAttributes)                  
                            <div class="clear">
                            </div>
                            <br />
                       var dataDictAddToCart = new ViewDataDictionary();
                       dataDictAddToCart.TemplateInfo.HtmlFieldPrefix = string.Format("addtocart_{0}", defaultProductVariant.Id);
                            @Html.Partial("_ProductVariantAddToCart", defaultProductVariant.AddToCart, dataDictPrice)                    
                        }
                    </div>
                    <div class="clear">
                    </div>
                    <div class="clear">
                    </div>
                    @if (errors.Count > 0)
                    {
                        //display errors   
                        <span class="message-error">
                            @for (int i = 0; i < errors.Count; i++)
                            {
                                @errors[i]
                           if (i != errors.Count - 1)
                           {
                                <br />
                           }
                            }
                        </span>
                        <div class="clear">
                        </div>
                    }
                    <br />
                    @Html.Action("ProductEmailAFriendButton", "Catalog", new { productId = Model.Id })
                    &nbsp; @Html.Action("CompareProductsButton", "Catalog", new { productId = Model.Id })
                    
                </div>
                <div class="fulldescription">
                    @*@Html.Raw(Model.FullDescription)*@
                    @Html.Raw(Model.ShortDescription.Replace("[br]","<br/>"))
                </div>
            </div>
        </div>
        <div class="clear">
        </div>
        <div class="product-collateral">
            <div class="product-variant-line">
                <!--product tier prices-->
                @Html.Action("ProductTierPrices", "Catalog", new { productVariantId = defaultProductVariant.Id })
                <div class="clear">
                </div>
                @{
           var dataDictGiftCard = new ViewDataDictionary();
           dataDictGiftCard.TemplateInfo.HtmlFieldPrefix = string.Format("giftcard_{0}", defaultProductVariant.Id);
                    @Html.Partial("_GiftCardInfo", defaultProductVariant.GiftCard, dataDictGiftCard)
                }
            </div>
            <div>
                @Html.Action("ProductSpecifications", "Catalog", new { productId = Model.Id })
            </div>
            <div class="clear">
            </div>
            
            <div class="grey">
                <script type="text/javascript">
                    $(document).ready(function () {
                        /*tabs*/
                        $(".tabHead").click(function () {

                            $(".ajax__tab_active").removeClass("ajax__tab_active");
                            $(".active").addClass("hide");
                            $(".active").removeClass("active");

                            $(this).addClass("ajax__tab_active");
                            var index = $(this).attr("id").replace("tab_", "");
                            $("#tab_content_" + index).addClass("active");
                            $("#tab_content_" + index).removeClass("hide");
                        });
                    });
                </script>
                <div class="grey ajax__tab_container ajax__tab_default">
                    <div class="ajax__tab_header">
                        <span id="tab_1" class="tabHead ajax__tab_active">
                            <span class="ajax__tab_outer">
                                <span class="ajax__tab_inner">
                                    <span class="ajax__tab_tab">Description</span>
                                </span>
                            </span>
                        </span>
                        <span id="tab_2" class="tabHead">
                            <span class="ajax__tab_outer">
                                <span class="ajax__tab_inner">
                                    <span class="ajax__tab_tab">Size Chat</span>
                                </span>
                            </span>
                        </span>
                        
                        <span id="tab_4" class="tabHead">
                            <span class="ajax__tab_outer">
                                <span class="ajax__tab_inner">
                                    <span class="ajax__tab_tab">payment&amp;shipping</span>
                                </span>
                            </span>
                       </span>
                       @if (Model.SpecificationAttributeModels.Count > 0)
                       {
                           <span id="tab_3" class="tabHead">
                                <span class="ajax__tab_outer">
                                    <span class="ajax__tab_inner">
                                        <span class="ajax__tab_tab">Product Specifications</span>
                                    </span>
                                </span>
                            </span>
                       }
                       <span id="tab_5" class="tabHead">
                            <span class="ajax__tab_outer">
                                <span class="ajax__tab_inner">
                                    <span class="ajax__tab_tab">Product reviews</span>
                                </span>
                            </span>
                        </span>
                        <span id="tab_6" class="tabHead">
                            <span class="ajax__tab_outer">
                                <span class="ajax__tab_inner">
                                    <span class="ajax__tab_tab">Product tags</span>
                                </span>
                            </span>
                        </span>
                    </div>
                </div>
                <div class="ajax__tab_body">
                    <div id="tab_content_1" class="ajax__tab_panel active" >
                        <div style="margin: 2px; text-align:center; font-family: verdana,Arial,Helvetica,sans-serif;
                        font-size: 11px">
                            @Html.Partial("_ProductPicturesDesc", Model)                  
                            @Html.Raw(Model.FullDescription)
                        </div>
                    </div>
                    <div id="tab_content_2" class="ajax__tab_panel hide" >
                        <br />
                        <img alt="" src="/Content/images/sizeChat.jpg" />
                        <br />
                        <img alt="" src="/Content/images/shoeChat.jpg" />
                        <br />
                        <a href="/Content/images/sizeGuide.jpg" target="_blank"><span style="font-weight: bold">
                            Size Guide</span></a>
                     
                        
                    </div>
                    
                    <div id="tab_content_4" class="ajax__tab_panel hide" >
                        <div style="padding: 10,0,0,0; text-align: left">
                        <span style="font-weight: bold;">Shiping:</span> When we receive your payment, Your
                        orders will be dealt within 24 hours.Normally, it will take 3--7 days to make your
                        cosplay costume after we got your payment. It will then take about 5--20 working
                        days for the package travel from our facilities to your destination. So, you can
                        get your dress in 8-27 working days. We will ship it by EMS,DHL,Airmail. and we
                        will give you the tracking number after we sent out your costume.<br />
                        if you need it by a specific date(e.g.convention date), please email(procosplay.com@gmail.com)
                        to let us know.<br />
                        <span style="font-weight: bold">payment:</span> Paypal is the only payment method
                        available to use on procosplay.com.<b>Pay by Paypal</b> When you select PayPal as
                        the payment method, you should go to the PayPal site, where you can send your payment.
                        As shown below<br />
                        <br />
                        <strong>1.paypal account</strong><br />
                        <br />
                        <img src="/Content/images/payment.jpg" width="550" height="350"
                            alt="paypal" /><br />
                        <br />
                        <strong>2.debit or credit card</strong><br />
                        <br />
                        you has not a paypal account,you can pay for it with debit or credit card<br />
                        <img src="/Content/images/credit.jpg" alt="paypal" width="550" /><br />
                        <br />
                        <img src="/Content/images/BillInfo.jpg" alt="paypal" width="550" /><br />
                    </div>
                    </div>
                    <div id="tab_content_3" class="ajax__tab_panel hide" >
                        @Html.Action("ProductSpecifications", "Catalog", new { productId = Model.Id })
                        
                    </div>
                    <div id="tab_content_5" class="ajax__tab_panel hide" >
                        @Html.Action("ProductReviewOverview", "Catalog", new { productId = Model.Id })
                    </div>
                    <div id="tab_content_6" class="ajax__tab_panel hide" >
                        <div>
                            @Html.Action("ProductTags", "Catalog", new { productId = Model.Id })
                        </div>
                    </div>
                </div>
            </div>
            <div class="clear">
            </div>
            <div>
                @Html.Action("ProductsAlsoPurchased", "Catalog", new { productId = Model.Id })
            </div>
            <div class="clear">
            </div>
            <div>
                @Html.Action("RelatedProducts", "Catalog", new { productId = Model.Id })
            </div>
        </div>
    }
</div>
